﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="CateringSystem.PlatForm.Login" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <link href="../Scripts/jquery-mobile/jquery.mobile.theme-1.0.min.css" rel="stylesheet"
        type="text/css">
    <link href="../Scripts/jquery-mobile/jquery.mobile.structure-1.0.min.css" rel="stylesheet"
        type="text/css">
    <script src="../Scripts/jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
    <script src="../Scripts/jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>
    <style type="text/css">
        body
        {
            background: url(../Images/mobile/bodyBg.png);
        }
        .ui-mobile, .ui-mobile body
        {
            min-height: 100%;
            height: auto;
        }
        ul, li
        {
            margin: 0;
            padding: 0;
            list-style: none;
        }
        #logIn
        {
            background: url(../Images/mobile/bodyBg2.png) center center no-repeat;
            text-shadow: none;
            color: #FFFFFF;
            box-shadow: 0 0 500px rgba(0,0,0,1) inset;
        }
        h1
        {
            text-align: center;
        }
        .logFrm
        {
            width: 500px;
            margin: -160px 0 0 -250px;
            left: 50%;
            top: 50%;
            position: absolute;
            height: 320px;
        }
        .ui-field-contain
        {
            padding: 0;
            margin: 0 0 20px 0;
            border: none;
        }
        .ui-field-contain ul
        {
            display: block;
            border: 1px solid #950800;
            border-radius: 10px;
            padding: 15px;
            background: #FFFFFF;
            box-shadow: 3px 3px 5px rgba(0,0,0,.2) inset;
        }
        .ui-field-contain ul li
        {
            text-align: center;
        }
        .ui-field-contain input.inp
        {
            height: 30px;
            line-height: 30px;
            border: none;
            margin: 0;
            width: 94%;
            outline: none;
            font-size: 20px;
            color: #bb2200;
            padding: 1% 3%;
            font-family: "Microsoft Yahei";
            outline: none;
            background: transparent;
            border-radius: 0;
            box-shadow: none;
        }
        .bor
        {
            border-bottom: 1px solid #bb2200;
            padding-bottom: 10px;
            margin-bottom: 10px;
        }
        #logIn .logInBtn
        {
            display: block;
            text-align: center;
            font-size: 22px;
            color: #994400;
            text-shadow: 0 0 1px rgba(255,188,0,1);
            text-decoration: none;
            border-radius: 10px;
            background: -webkit-gradient(linear, 0 0, 0 100%, from(#ffcf00), to(#ff7200));
            background-image: -moz-linear-gradient(#ffcf00,#ff7200);
            background-image: -ms-linear-gradient(#ffcf00,#ff7200);
            background-image: -o-linear-gradient(#ffcf00,#ff7200);
            background-image: linear-gradient(#ffcf00,#ff7200);
            box-shadow: 0 1px 2px rgba(0,0,0,.4);
            margin: 0;
            border: none;
            padding: 0.8em 0;
            color: #994400;
            border: 1px solid #994400;
        }
        #logIn .logInBtn:hover
        {
            background: -webkit-gradient(linear, 0 0, 0 100%, from(#ffd937), to(#ff7200));
            box-shadow: 0 2px 3px rgba(0,0,0,.4);
        }
        #logIn .logInBtn:active
        {
            background: #ec6a16;
            border: none;
            box-shadow: none;
            box-shadow: inset 0 2px 3px rgba(0,0,0,.4);
        }
        #logIn .logInBtn:visited
        {
            color: #994400;
        }
        .ui-content
        {
            margin: 10% 10%;
            paddding: 0;
        }
        .ui-btn-inner
        {
            border-radius: 0;
            box-shadow: none;
            border: none;
        }
        .ui-btn-corner-all, .ui-corner-all
        {
            border-radius: 10px;
            margin: 0;
        }
        #logIn .ui-btn
        {
        }
    </style>
</head>
<body>
    <script type="text/javascript">
        $("#logIn").ready(function () {
            $("#lkLogin").click(function () {
                $.ajax({
                    type: "get",
                    url: "/Mobile/Login.aspx",
                    data: "UserName=" + $("#textinput").val() + "&UserPwd=" + $("#passwordinput").val(),
                    success: function (info) { location.href ="/PlatForm/Main.aspx" }

                });
            });
        });


    </script>
    <form id="form1" runat="server">
    <div data-role="page" id="logIn">
        <div data-role="content">
            <h1>
                <img src="../images/mobile/titleLog.png" width="100%" alt="某某餐饮管理系统" style="width: 100%;"></h1>
            <div data-role="fieldcontain">
                <ul>
                    <li class="bor">
                        <input type="text" name="textinput" id="textinput" class="inp" placeholder="请输入您的帐户" /></li>
                    <li>
                        <input type="password" name="passwordinput" id="passwordinput" class="inp" placeholder="请输入您的密码" />
                    </li>
                </ul>
            </div>
            <a href="javascript:void(0)" id="lkLogin" class="logInBtn">立即登录</a>
        </div>
    </div>
    </form>
</body>
</html>
